VUE之 VUE

2024-07-12 06:05| 来源: 网络整理| 查看: 265

vue环境下使用百度地图定位发现，地图定位不准确，有偏差，带红叉的是我们赋值的没有转换坐标的定位，对号是我们转换了坐标以后的定位，相对来说转换的坐标是符合我们的定位要求的，为什么会出现这样的差别呢，那先来看看坐标的种类：

目前国内主要有以下三种坐标系：

WGS84：为一种大地坐标系，也是目前广泛使用的GPS全球卫星定位系统使用的坐标系。

GCJ02：又称火星坐标系，是由中国国家测绘局制订的地理信息系统的坐标系统。由WGS84坐标系经加密后的坐标系。

BD09：为百度坐标系，在GCJ02坐标系基础上再次加密。其中bd09ll表示百度经纬度坐标，bd09mc表示百度墨卡托米制坐标。

非中国地区地图，服务坐标统一使用WGS84坐标。

百度对外接口的坐标系为BD09坐标系，并不是GPS采集的真实经纬度，在使用百度地图JavaScript API服务前，需先将非百度坐标通过坐标转换接口转换成百度坐标。

原始坐标

handler ({BMap, map}) { var geolocation = new BMap.Geolocation(); geolocation.getCurrentPosition(function (position) { if (this.getStatus() == 'BMAP_STATU_SUCCESS') { this.center.lng = this.longitude this.center.lat = this.latitude this.zoom = 14 } }) }

处理过的坐标

handler ({BMap, map}) { var x = this.longitude; var y = this.latitude; var ggPoint = new BMap.Point(x,y); //地图初始化 var bm = new BMap.Map("allmap"); bm.centerAndZoom(ggPoint, 15); bm.addControl(new BMap.NavigationControl()); //添加gps marker和label var markergg = new BMap.Marker(ggPoint); bm.addOverlay(markergg); //添加GPS marker var labelgg = new BMap.Label("未转换的GPS坐标（错误）",{offset:new BMap.Size(20,-10)}); markergg.setLabel(labelgg); //添加GPS label var translateCallback = function(data){//坐标转换完之后的回调函数 console.log(data) console.log(data.status) if(data.status === 0) { var marker = new BMap.Marker(data.points[0]); bm.addOverlay(marker); var label = new BMap.Label("转换的GPS坐标（正确）",{offset:new BMap.Size(20,-10)}); marker.setLabel(label); //添加百度label bm.setCenter(data.points[0]); } } //坐标转换完之后的回调函数 setTimeout(()=>{ var convertor = new BMap.Convertor(); var pointArr = []; pointArr.push(ggPoint); convertor.translate(pointArr, 1, 5, translateCallback) }, 1000); },

【本文地址】

公司简介

联系我们